<template>
    <div class="">
        <div class="title-row">
            <div class="flex item-center">
                <div class="label-line"></div>
                <span class="title">智能柜使用情况</span>
            </div>
            <div class="line"></div>
        </div>
        <div class="chests-content">
            <ul v-for="(item,index) in dataList" :key = "index" class="chests-ul">
                <li 
                    v-for = "(sItem,sIndex) in item" 
                    :key = "sIndex" 
                    v-bind:class = "{active:sIndex%2==0}"
                    class="chests-li"></li>
            </ul>
        </div>
    </div>
</template>

<script>
import { chunkArr } from "../../utils";
export default {
    data() {
        return {
            filter: 1, //1表示累计，2表示今日
            dataList: []
        };
    },
    methods: {
        handleData() {}
    },
    created() {
        let defaultList = Array.from(new Array(72));
        let arr = chunkArr(defaultList, 8);
        this.dataList = arr;
    }
};
</script>

<style lang = "scss" scoped>
@import "../../css/unifyAcceptWorkbench.scss";

.chests-content {
    padding-top:25px;
    display: flex;
    .chests-ul{
        display: flex;
        flex: 1;
        margin-right: 10px;
    }
    .chests-li {
        width: 100%;
        height:18px;
        background: #eeeeee;
        margin-bottom: 6px;
        &:last-child{
            margin-right: 0;
        }
        &.active{
            background-color: #1a36a9;
        }
    }
}
</style>